<!DOCTYPE html>

<head>

    <meta charset="UTF-8">

    <title>商品详情</title>

    <!-- jquery -->

    <script type="text/javascript" src="/js/jquery.min.js"></script>

    <!-- bootstrap -->

    <link rel="stylesheet" type="text/css"

          href="/bootstrap/css/bootstrap.min.css"/>

    <script type="text/javascript" src="/bootstrap/js/bootstrap.min.js">

    </script>

    <!-- layer -->

    <script type="text/javascript" src="/layer/layer.js"></script>

    <!-- common.js -->

    <script type="text/javascript" src="/js/common.js"></script>

</head>

<body>

<div class="panel panel-default">

    <div class="panel-heading">秒杀商品详情</div>

    <div class="panel-body">

        <span id="userTip"> 您还没有登录，请登陆后再操作<br/></span>

        <span>没有收货地址的提示。。。</span>

    </div>

    <table class="table" id="goods">

        <tr>

            <td>商品id</td>

            <td colspan="3" id="goodsId"></td>

        </tr>
        <tr>

            <td>商品名称</td>

            <td colspan="3" id="goodsName"></td>

        </tr>

        <tr>

            <td>商品图片</td>

            <td colspan="3"><img id="goodsImg" width="200" height="200"/></td>

        </tr>

        <tr>

            <td>秒杀开始时间</td>

            <td id="startTime"></td>

            <td>

                <input type="hidden" id="remainSeconds"/>

                <!-- <span if="secKillStatus eq 0">秒杀倒计时：<span

id="countDown"

                             text="remainSeconds">

</span>秒</span>

        <span if="secKillStatus eq 1">秒杀进行中</span>

        <span if="secKillStatus eq 2">秒杀已结束</span>-->

                <span id="seckillTip"></span>

            </td>

            <td>
                <!--                <form id="seckillForm" method="post"-->

                <!--                        action="/seckill/doSeckill">-->

                <!--                  <button class="btn btn-primary btn-block" type="submit"-->

                <!--                            id="buyButton">立即秒杀</button>-->

                <!--                  <input type="hidden" name="goodsId" id="goodsId"/>-->

                <!--                </form>-->


                <!--                      <button class="btn btn-primary btn-block" type="submit" id="buyButton" onclick="doSeckill()">-->
                <!--                          立即秒杀-->
                <!--                          <input type="hidden" name="goodsId" id="goodsId"/>-->
                <!--                      </button> -->
                <div class="row">
                    <div class="form-inline">
                        <img id="captchaImg" width="130" height="32" onclick="refreshCaptcha()" style="display: none"/>
                        <input id="captcha" class="form-control" style="display: none"/>
                        <button class="btn btn-primary" type="button" id="buyButton"
                                onclick="getSeckillPath()">立即秒杀
                        </button>
                    </div>
                </div>
            </td>

        </tr>

        <tr>

            <td>商品原价</td>

            <td colspan="3" id="goodsPrice"></td>

        </tr>

        <tr>

            <td>秒杀价</td>

            <td colspan="3" id="seckillPrice"></td>

        </tr>

        <tr>

            <td>库存数量</td>

            <td colspan="3" id="stockCount"></td>

        </tr>

    </table>

</div>

</body>

<script>


    $(function () {

        getDetails();

    });

    function refreshCaptcha() {


        $("#captchaImg").attr("src", "/seckill/captcha?goodsId=" + $("#goodsId").val());
    }

    function getSeckillPath() {
        var goodsId = $("#goodsId").val();
        var captcha=$("#captcha").val();
        g_showLoading();
        $.ajax({
            url: "/seckill/path",
            type: "GET",
            data: {
                goodsId: goodsId,
                captcha:captcha
            },
            success: function (data) {
                if (data.code == 200) {
                    var path = data.object;
                    doSeckill(path);

                } else {
                    layer.msg(data.message);
                }
            },
            error: function () {
                layer.msg("客户端请求错误");
            }

        })
    }


    function getDetails() {

        var goodsId = g_getQueryString("goodsId");

        $.ajax({

            url: "/goods/detail/" + goodsId,

            type: "GET",

            success: function (data) {

                if (data.code == 200) {

                    render(data.object);

                } else {

                    layer.msg(data.message);

                }

            },

            error: function () {

                layer.msg("客户端请求错误");

            }

        })

    }

    function render(detail) {

        var user = detail.user;

        var goods = detail.goodsVo;

        var remainSeconds = detail.remainSeconds;

        if (user) {

            $("#userTip").hide();

        }

        $("#goodsName").text(goods.goodsName);

        $("#goodsImg").attr("src", goods.goodsImg);

        $("#startTime").text(goods.startDate);

        $("#remainSeconds").val(remainSeconds);

        $("#goodsId").val(goods.id);

        $("#goodsPrice").text(goods.goodsPrice);

        $("#seckillPrice").text(goods.seckingPrice);

        $("#stockCount").text(goods.stockCount);

        countDown();

    }

    function doSeckill(path) {
        $.ajax({
            url: '/seckill/' + path + '/doSeckill',
            type: "POST",
            data: {
                goodsId: $("#goodsId").val(),
            },
            success: function (data) {
                if (data.code == 200) {
                    // window.location.href = "/orderDetail.htm?orderId=" + data.object.id;
                    getResult($("#goodsId").val());

                } else {
                    layer.msg(data.message);
                }
            },
            error: function () {
                layer.msg("客户端请求错误");
            }
        })
    }

    function getResult(goodsId) {
        g_showLoading();
        $.ajax({
            url: "/seckill/result",
            type: "GET",
            data: {
                goodsId: goodsId,
            },
            success: function (data) {
                if (data.code == 200) {
                    var result = data.object;
                    if (result < 0) {
                        layer.msg("秒杀失败！");
                    } else if (result == 0) {
                        setTimeout(function () {
                            getResult(goodsId);
                        }, 50);
                    } else {
                        layer.confirm("恭喜你，秒杀成功！查看订单？", {btn: ["确定", "取 消"]},
                            function () {
                                window.location.href = "/orderDetail.htm?orderId=" + result;
                            },
                            function () {
                                layer.close();
                            });
                    }
                } else {
                    layer.msg(data.message);
                }
            },
            error: function () {
                layer.msg("客户端请求错误");
            }
        })
    }

    function countDown() {

        var remainSeconds = $("#remainSeconds").val();

        var timeout;

        //秒杀还没开始，倒计时

        if (remainSeconds > 0) {

            $("#buyButton").attr("disabled", true);

            $("#seckillTip").html("秒杀倒计时：" + remainSeconds + "秒");

            timeout = setTimeout(function () {

                    // $("#countDown").text(remainSeconds - 1);

                    $("#remainSeconds").val(remainSeconds - 1);

                    countDown();

                },

                1000
            );

        }

        //秒杀进行中

        else if (remainSeconds == 0) {

            $("#buyButton").attr("disabled", false);

            if (timeout) {

                clearTimeout(timeout);

            }

            $("#seckillTip").html("秒杀进行中");
            $("#captchaImg").attr("src", "/seckill/captcha?goodsId=" + $("#goodsId").val())
            $("#captchaImg").show();
            $("#captcha").show();

            //秒杀已经结束

        } else {

            $("#buyButton").attr("disabled", true);

            $("#seckillTip").html("秒杀已经结束");
            $("#captchaImg").hide();
            $("#captcha").hide();

        }

    }

</script>

</html>